
    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>Title</title>
    </head>
    <body>
    
<div class="archive_info">
<h1>HTML <span class="color_h1">列表</span></h1>
<hr/><p class="intro">HTML 支持有序、无序和定义列表:</p>
<div class="example">
<h2 class="example">HTML 列表</h2>
<div class="example_result notranslate">
<table border="0" width="100%">
<tbody><tr>
<td width="50%">
<h3>有序列表</h3>
<ol>
<li>第一个列表项</li>
<li>第二个列表项</li>
<li>第三个列表项</li>
</ol>
</td>
<td width="50%">
<h3>无序列表</h3>
<ul>
<li>列表项</li>
<li>列表项</li>
<li>列表项</li>
</ul>
</td>
</tr></tbody></table>
</div>
</div>
<hr/>
<table border="0" cellpadding="0" cellspacing="0" width="100%">
<tbody><tr>
<td align="left" width="48px"><img alt="实例" border="0" decoding="async" src="/images/tryitimg.gif"/></td>
<td align="left"><h2>在线实例</h2></td>
</tr>
</tbody></table>
<p><a  target="_blank">无序列表</a><br/>
本例演示无序列表。</p>
<p><a  target="_blank">有序列表</a><br/>
本例演示有序列表。</p>
<p>（可以在本页底端找到更多实例。）</p>
<hr/><h2>HTML无序列表</h2>
<p>无序列表是一个项目的列表，此列项目使用粗体圆点（典型的小黑圆圈）进行标记。 </p><p>无序列表使用 &lt;ul&gt; 标签</p>
<div class="code notranslate"><div>


&lt;ul&gt;<br/>
&lt;li&gt;Coffee&lt;/li&gt;<br/>
&lt;li&gt;Milk&lt;/li&gt;<br/>
&lt;/ul&gt;


</div></div>
<p>浏览器显示如下：</p>
<ul>
<li>Coffee</li>
<li>Milk</li>
</ul>
<hr/><h2>HTML 有序列表</h2>
<p>同样，有序列表也是一列项目，列表项目使用数字进行标记。 有序列表始于 &lt;ol&gt; 标签。每个列表项始于 &lt;li&gt; 标签。</p>
<p>列表项使用数字来标记。</p>
<div class="code notranslate"><div>


&lt;ol&gt;<br/>
&lt;li&gt;Coffee&lt;/li&gt;<br/>
&lt;li&gt;Milk&lt;/li&gt;<br/>
&lt;/ol&gt;


</div></div>
<p>浏览器中显示如下：</p>
<ol>
<li>Coffee</li>
<li>Milk</li>
</ol>
<hr/><h2>HTML 自定义列表</h2>
<p>自定义列表不仅仅是一列项目，而是项目及其注释的组合。</p>
<p>自定义列表以 &lt;dl&gt; 标签开始。每个自定义列表项以 &lt;dt&gt; 开始。每个自定义列表项的定义以 &lt;dd&gt; 开始。</p>
<div class="code notranslate"><div>


&lt;dl&gt;<br/>
&lt;dt&gt;Coffee&lt;/dt&gt;<br/>
&lt;dd&gt;- black hot drink&lt;/dd&gt;<br/>
&lt;dt&gt;Milk&lt;/dt&gt;<br/>
&lt;dd&gt;- white cold drink&lt;/dd&gt;<br/>
&lt;/dl&gt;


</div></div>
<p>浏览器显示如下：</p>
<dl>
<dt>Coffee</dt>
<dd>- black hot drink</dd>
<dt>Milk</dt>
<dd>- white cold drink</dd>
</dl>
<hr/><h2>注意事项 - 有用提示</h2>
<p><b>提示:</b> 列表项内部可以使用段落、换行符、图片、链接以及其他列表等等。</p>
<hr/><div class="tryit_ex">
<img alt="Examples" decoding="async" height="46px" src="/images/tryitimg.gif" width="40"/><h2>更多实例</h2>
</div>
<p><a  target="_blank">不同类型的有序列表</a><br/>
本例演示不同类型的有序列表。</p>
<p><a  target="_blank">不同类型的无序列表</a><br/>
本例演示不同类型的无序列表。</p>
<p><a  target="_blank">嵌套列表</a><br/>
本例演示如何嵌套列表。</p>
<p><a  target="_blank">嵌套列表 2</a><br/>
本例演示更复杂的嵌套列表。</p>
<p><a  target="_blank">自定义列表</a><br/>
本例演示一个定义列表。</p>
<hr/><h2>HTML 列表标签</h2>
<table class="reference notranslate">
<tbody><tr>
<th align="left">标签</th>
<th align="left">描述</th>
</tr>
<tr>
<td><a  target="_blank">&lt;ol&gt;</a></td>
<td>定义有序列表</td>
</tr>
<tr>
<td><a  target="_blank">&lt;ul&gt;</a></td>
<td>定义无序列表</td>
</tr>
<tr>
<td><a  target="_blank">&lt;li&gt;</a></td>
<td>定义列表项</td>
</tr>
<tr>
<td><a >&lt;dl&gt;</a></td>
<td>定义列表</td>
</tr>
<tr>
<td><a  target="_blank">&lt;dt&gt;</a></td>
<td>自定义列表项目</td>
</tr>
<tr>
<td><a  target="_blank">&lt;dd&gt;</a></td>
<td>定义自定列表项的描述</td>
</tr>
</tbody></table> <div class="scroll-top"><a >返回顶部</a></div>
</div>

    </body>
    </html>
    